<template>
	<view class="assignment fonts">
		<swiper class="swiper" :current="current" duration="300">
			<swiper-item v-for="(item, index) in questions" @touchmove.stop="" :key="index">
				<Type21 :question="item" :ref="'qustion' + index" v-if="[21, 23, 34, 45].indexOf(item.typeCode) > -1" />
				<Type22 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 22" />
				<Type24 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 24" />
				<Type25 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 25" />
				<Type27 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 27" />
				<Type28 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 28" />
				<Type32 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 32" />
				<Type33 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 33" />
				<Type29 :question="item" :ref="'qustion' + index" v-if="[26, 29, 30, 31, 38, 44, 59, 115, 117, 129, 131].indexOf(item.typeCode) > -1" />
				<Type35For3 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 35 && item.optionArticles.length === 3" />
				<Type35For5 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 35 && item.optionArticles.length > 3" />
				<Type36 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 36" />
				<Type37 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 37" />
				<Type39 :question="item" :ref="'qustion' + index" v-if="[39, 40, 42, 43, 49, 54, 94, 132, 133, 136, 143, 144].indexOf(item.typeCode) > -1" />
				<Type41 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 41" />
				<Type46 :question="item" :ref="'qustion' + index" v-if="[46, 52].indexOf(item.typeCode) > -1" />
				<Type47 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 47" />
				<Type48 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 48" />
				<Type50 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 50" />
				<Type51 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 51" />
				<Type53 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 53" />
				<Type55 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 55" />
				<Type56 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 56" />
				<Type57 :question="item" :ref="'qustion' + index" v-if="[57, 61, 140].indexOf(item.typeCode) > -1" />
				<Type58 :question="item" :ref="'qustion' + index" v-if="[58, 63].indexOf(item.typeCode) > -1" />
				<Type60 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 60" />
				<Type62 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 62" />
				<Type64 :question="item" :ref="'qustion' + index" v-if="[64, 69].indexOf(item.typeCode) > -1" />
				<Type65 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 65" />
				<Type66 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 66" />
				<Type67 :question="item" :ref="'qustion' + index" v-if="[67, 70].indexOf(item.typeCode) > -1" />
				<Type68 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 68" />
				<Type71 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 71" />
				<Type72 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 72" />
				<Type73 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 73" />
				<Type74 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 74" />
				<Type75 :question="item" :ref="'qustion' + index" v-if="[75, 76, 78, 81, 87, 91, 92, 95].indexOf(item.typeCode) > -1" />
				<Type77 :question="item" :ref="'qustion' + index" v-if="[77, 80, 90].indexOf(item.typeCode) > -1" />
				<Type79 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 79" />
				<Type82 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 82" />
				<Type83 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 83" />
				<Type84 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 84" />
				<Type85 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 85" />
				<Type86 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 86" />
				<Type88 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 88" />
				<Type89 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 89" />
				<Type93 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 93" />
				<Type96 :question="item" :ref="'qustion' + index" v-if="[96, 97, 98].indexOf(item.typeCode) > -1" />
				<Type99 :question="item" :ref="'qustion' + index" v-if="[99, 100].indexOf(item.typeCode) > -1" />
				<Type101 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 101" />
				<Type102 :question="item" :ref="'qustion' + index" v-if="[102, 104].indexOf(item.typeCode) > -1" />
				<Type103 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 103" />
				<Type105 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 105" />
				<Type106 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 106" />
				<Type107 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 107" />
				<Type108 :question="item" :ref="'qustion' + index" v-if="[108, 109].indexOf(item.typeCode) > -1" />
				<Type110 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 110" />
				<Type111 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 111" />
				<Type112 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 112" />
				<Type113 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 113" />
				<Type114 :question="item" :ref="'qustion' + index" v-if="[114, 116].indexOf(item.typeCode) > -1" />
				<Type118 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 118" />
				<Type119 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 119" />
				<Type120 :question="item" :ref="'qustion' + index" v-if="[120, 125].indexOf(item.typeCode) > -1" />
				<Type121 :question="item" :ref="'qustion' + index" v-if="[121, 127].indexOf(item.typeCode) > -1" />
				<Type122 :question="item" :ref="'qustion' + index" v-if="[122, 123].indexOf(item.typeCode) > -1" />
				<Type124 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 124" />
				<Type126 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 126" />
				<Type128 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 128" />
				<Type130 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 130" />
				<Type134 :question="item" :ref="'qustion' + index" v-if="[134, 135].indexOf(item.typeCode) > -1" />
				<Type137 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 137" />
				<Type138 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 138" />
				<Type139 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 139" />
				<Type141 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 141" />
				<Type142 :question="item" :ref="'qustion' + index" v-if="item.typeCode === 142" />
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
import Type21 from './phase1/type21.vue'
import Type22 from './phase1/type22.vue'
import Type24 from './phase2/type24.vue'
import Type25 from './phase2/type25.vue'
import Type27 from './phase2/type27.vue'
import Type28 from './phase2/type28.vue'
import Type29 from './phase2/type29.vue'
import Type32 from './phase2/type32.vue'
import Type33 from './phase2/type33.vue'
import Type35For3 from './phase3/type35For3.vue'
import Type35For5 from './phase3/type35For5.vue'
import Type36 from './phase3/type36.vue'
import Type37 from './phase3/type37.vue'
import Type39 from './phase3/type39.vue'
import Type41 from './phase3/type41.vue'
import Type46 from './phase3/type46.vue'
import Type47 from './phase3/type47.vue'
import Type48 from './phase3/type48.vue'
import Type50 from './phase3/type50.vue'
import Type51 from './phase3/type51.vue'
import Type53 from './phase3/type53.vue'
import Type55 from './phase3/type55.vue'
import Type56 from './phase4/type56.vue'
import Type57 from './phase4/type57.vue'
import Type58 from './phase4/type58.vue'
import Type60 from './phase4/type60.vue'
import Type62 from './phase4/type62.vue'
import Type64 from './phase4/type64.vue'
import Type65 from './phase4/type65.vue'
import Type66 from './phase4/type66.vue'
import Type67 from './phase4/type67.vue'
import Type68 from './phase4/type68.vue'
import Type71 from './phase4/type71.vue'
import Type72 from './phase4/type72.vue'
import Type73 from './phase5/type73.vue'
import Type74 from './phase5/type74.vue'
import Type75 from './phase5/type75.vue'
import Type77 from './phase5/type77.vue'
import Type79 from './phase5/type79.vue'
import Type82 from './phase5/type82.vue'
import Type83 from './phase5/type83.vue'
import Type84 from './phase5/type84.vue'
import Type85 from './phase5/type85.vue'
import Type86 from './phase5/type86.vue'
import Type88 from './phase5/type88.vue'
import Type89 from './phase5/type89.vue'
import Type93 from './phase6/type93.vue'
import Type96 from './phase6/type96.vue'
import Type99 from './phase6/type99.vue'
import Type101 from './phase7/type101.vue'
import Type102 from './phase7/type102.vue'
import Type103 from './phase7/type103.vue'
import Type105 from './phase7/type105.vue'
import Type106 from './phase7/type106.vue'
import Type107 from './phase7/type107.vue'
import Type108 from './phase8/type108.vue'
import Type110 from './phase8/type110.vue'
import Type111 from './phase8/type111.vue'
import Type112 from './phase8/type112.vue'
import Type113 from './phase8/type113.vue'
import Type114 from './phase9/type114.vue'
import Type118 from './phase9/type118.vue'
import Type119 from './phase9/type119.vue'
import Type120 from './phase10/type120.vue'
import Type121 from './phase10/type121.vue'
import Type122 from './phase10/type122.vue'
import Type124 from './phase10/type124.vue'
import Type126 from './phase10/type126.vue'
import Type128 from './phase11/type128.vue'
import Type130 from './phase11/type130.vue'
import Type134 from './phase11/type134.vue'
import Type137 from './phase11/type137.vue'
import Type138 from './phase11/type138.vue'
import Type139 from './phase11/type139.vue'
import Type141 from './phase11/type141.vue'
import Type142 from './phase11/type142.vue'
import { mapGetters, mapActions } from 'vuex'
export default {
	data() {
		return {
			current: 0,
			questions: [
			
			]
		}
	},
	components: {
		Type21,
		Type22,
		Type24,
		Type25,
		Type27,
		Type32,
		Type33,
		Type28,
		Type29,
		Type35For3,
		Type35For5,
		Type36,
		Type37,
		Type39,
		Type41,
		Type46,
		Type47,
		Type48,
		Type50,
		Type51,
		Type53,
		Type55,
		Type56,
		Type57,
		Type58,
		Type60,
		Type62,
		Type64,
		Type65,
		Type66,
		Type67,
		Type68,
		Type71,
		Type72,
		Type73,
		Type74,
		Type75,
		Type77,
		Type79,
		Type82,
		Type83,
		Type84,
		Type85,
		Type86,
		Type88,
		Type89,
		Type93,
		Type96,
		Type99,
		Type101,
		Type102,
		Type103,
		Type105,
		Type106,
		Type107,
		Type108,
		Type110,
		Type111,
		Type112,
		Type113,
		Type114,
		Type118,
		Type119,
		Type120,
		Type121,
		Type122,
		Type124,
		Type126,
		Type128,
		Type130,
		Type134,
		Type137,
		Type138,
		Type139,
		Type141,
		Type142
	},
	onLoad(option) {
		this.questions = JSON.parse(decodeURIComponent(option.questions))
		console.log(this.questions)
		uni.setNavigationBarTitle({
			title: this.current + 1 + ' / ' + this.questions.length
		})
	},
	onShareAppMessage() {
		return {
			title: '孩子的认知优势，决定孩子的未来。赶紧测一测吧！',
			path: '/pages/evaluate/evaluate',
			imageUrl: ''
		}
	},
	mounted() {
		setTimeout(() => {
			this.questionPlay()
		}, 500)
	},
	onHide() {
		this.questionPause()
	},
	beforeDestroy() {
		this.questionPause()
	},
	watch: {
		current: function() {
			this.questionPlay()
		}
	},
	methods: {
		// 下一题
		next: function(option) {
			this.delayFunc(() => {
				const resultOption = Object.assign(
					{
						isSure: false,
						audioUrl: '',
						isPoint: true
					},
					option
				)
				this.questionPause()
				if (this.questions[this.current].answerTexts && this.questions[this.current].answerTexts.length === 0) {
					resultOption.isPoint = false
				}
				// return
				const json = {
					deviceUuid: this.deviceUuid,
					questionId: this.questions[this.current].id,
					serialNumber: this.current + 1,
					correct: resultOption.isSure,
					audioUrl: resultOption.audioUrl
				}
				if (resultOption.isPoint) {
					resultOption.isSure ? this.sucAudio() : this.losAudio()
				} else {
					this.neutralAudio()
				}
				this.$post(this.api.addAnswer, json)
				if (this.current < this.questions.length - 1) {
					const timer = setTimeout(() => {
						this.current++
						uni.setNavigationBarTitle({
							title: this.current + 1 + ' / ' + this.questions.length
						})
					}, 2000)
					this.$once('hook:beforeDestroy', function() {
						clearInterval(timer)
					})
				} else {
					uni.showToast({
						title: '已完成所有问题',
						duration: 2500
					})
					setTimeout(() => {
						this.$Router.replace({ name: 'review' })
					}, 2000)
				}
			})
		},
		// 播放问题
		questionPlay: function() {
			const ref = 'qustion' + this.current
			this.$refs[ref][0].questionPlay()
		},
		// 暂停播放问题
		questionPause: function() {
			const ref = 'qustion' + this.current
			this.$refs[ref][0].questionPause()
		},
		...mapActions('picbookStatus', ['setPreview'])
	}
}
</script>

<style lang="stylus">
@keyframes pointScale
	0%
		transform scale(1) rotate(-15deg)
	50%
		transform scale(1.3) rotate(-15deg)
	100%
		transform scale(1) rotate(-15deg)
@keyframes iconTap
	0%
		transform scale(1)
	100%
		transform scale(1.1)
@keyframes article
	0%
		transform scale(1)
		filter drop-shadow(0 0 8rpx #FF8C69)
	50%
		transform scale(1.1)
		filter drop-shadow(0 0 8rpx #FF8C69)
	100%
		transform scale(1)
		filter drop-shadow(0 0 8rpx #FF8C69)
@keyframes error
	0%
		transform rotate(0) translate3d(0, 0, 0)
	20%
		transform rotate(3deg) translate3d(0, 0, 0)
	40%
		transform rotate(-3deg) translate3d(0, 0, 0)
	60%
		transform rotate(3deg) translate3d(0, 0, 0)
	80%
		transform rotate(-3deg) translate3d(0, 0, 0)
	100%
		transform rotate(0) translate3d(0, 0, 0)
.error
	filter grayscale(1)
	animation error 700ms ease-in
.success
	color #FD8045 !important
	border-color #FD8045 !important
.hidden
	width 0 !important
	height 0 !important
	opacity 0 !important
	margin 0 !important
.assignment
	background-color #fefbf3
	border-radius 65rpx 65rpx 0 0
	height 100vh
	width 100vw
	position relative
	.swiper
		position absolute
		width 100%
		height 100%
.iconTap
	animation iconTap 0.3s
	animation-fill-mode forwards
.articleLight
	animation article 1.5s infinite
</style>
